
<script>
import TabBar from '@/components/common/tabbar/TabBar'
import TabBarItem from '@/components/common/tabbar/TabBarItem'
export default {
  name: 'RenderTabBar',
  data () {
    return {
      tabarContent: [
        {
          path: 'home',
          text: '首页'
        },
        {
          path: 'recommend',
          text: '推荐'
        },
        {
          path: 'category',
          text: '分类'
        },
        {
          path: 'mine',
          text: '我的'
        }
      ]
    }
  },
  render (h) {
    return (
      <TabBar>
        {
          this.tabarContent.map(item => {
            return <TabBarItem path={item.path}>
              <img src={require(`@/assets/images/tabbar/${item.path}.svg`)} slot="normal-icon"></img>
              <img src={require(`@/assets/images/tabbar/${item.path}_active.svg`)} slot="active-icon"></img>
              <div slot="text">{item.text}</div>
            </TabBarItem>
          })
        }
      </TabBar> 
    )
  }
}
</script>
<style lang="scss" scoped>

</style>